"use strict"
// import * as THREE from './three'
const World = {
    MAX_X : 100,                // 世界的尺寸
    MAX_Y : 100,
    MAX_Z : 100,
}

const Light = {
    Angle_x : Math.PI / 2,
    Angle_y : 0,
    Angle_z : Math.PI / 2,
    Pos_x : 0,
    Pos_y : 50,
    Pos_z : 0,
}

// const Gun_sizes = {
//     gun_anode : 7.05
// }

// const Holes_sizes = {
//     ground_anode : 22.25,
//     min_hole : 105.85,
//     lock_1 : 111.65,

// }

// 初始化相机和页面canvas元素，开启投影
const scene = new THREE.Scene();
const camera_global = new THREE.PerspectiveCamera(50,window.innerWidth / window.innerHeight,0.1,1000);
const renderer_global = new THREE.WebGLRenderer();
renderer_global.shadowMap.enabled = true;
renderer_global.shadowMap.type = THREE.PCFSoftShadowMap; // default THREE.PCFShadowMap
camera_global.position.set(World.MAX_X*0.9,World.MAX_Y/2,World.MAX_Z*0.9);
camera_global.lookAt(0,World.MAX_Y/4,0);
renderer_global.setSize(window.innerWidth/2,window.innerHeight/2);
document.body.appendChild(renderer_global.domElement);


// 直接看下方的光点，对应从电子枪内部向下看荧光屏图像
const camera_direct = new THREE.PerspectiveCamera(120,window.innerWidth / window.innerHeight,0.1,1000);
const renderer_direct = new THREE.WebGLRenderer();

renderer_direct.shadowMap.enabled = true;
renderer_direct.shadowMap.type = THREE.PCFSoftShadowMap; // default THREE.PCFShadowMap
// camera2.position.set(World.MAX_X*0.9,World.MAX_Y/2,World.MAX_Z*0.9);
// camera2.lookAt(0,World.MAX_Y/4,0);
camera_direct.position.set(0,20,0);
camera_direct.lookAt(0,0,0)
renderer_direct.setSize(window.innerWidth/2,window.innerHeight/2);
document.body.appendChild(renderer_direct.domElement);

// const geometry = new THREE.PlaneGeometry( 20, 20 );
// const material = new THREE.MeshBasicMaterial( {color: 0xffff00, side: THREE.DoubleSide} );
// const plane1 = new THREE.Mesh( geometry, material );
// plane1.rotateX(Math.PI / 2);
// scene.add( plane1 );

const axesHelper = new THREE.AxesHelper( World.MAX_X );
scene.add( axesHelper );

var amlight = new THREE.AmbientLight(0x003300);
// amlight.intensity = 10;
scene.add(amlight);

// light source
const electron_beam = new THREE.SpotLight( 0xffffff );  // 点光源模型
// 电子束被阳极孔和肖特基极孔遮挡。角度会跟着变化
electron_beam.castShadow = true; // default false
scene.add( electron_beam );
// 需要控制旋转方向
// 需要一根细线指示发射方向

// 需要一个可以跟着旋转的阳极孔。旋转中心可以调节。暂定就在光源和孔的连线中央高度处

const materialine = new THREE.LineBasicMaterial( { color: 0x0000ff } );
const points = [];
points.push( new THREE.Vector3( - 20, 0, 0 ) );
points.push( new THREE.Vector3( 20, 20, 0 ) );
// points.push( new THREE.Vector3( 10, 0, 0 ) );







const geometryline = new THREE.BufferGeometry().setFromPoints( points );
const pointing_line = new THREE.Line( geometryline, materialine );
scene.add( pointing_line );
pointing_line.rotation.set(Math.PI / 2,0,0);






const targetObject = new THREE.Object3D();
scene.add(targetObject);
targetObject.position.set(0,0,0);

electron_beam.target = targetObject;

electron_beam.position.y = 50;
electron_beam.position.x = 10;

// light.position.x = 50;


//Set up shadow properties for the light
electron_beam.shadow.mapSize.width = 512; // default
electron_beam.shadow.mapSize.height = 512; // default
electron_beam.shadow.camera.near = 0.5; // default
electron_beam.shadow.camera.far = 500; // default
electron_beam.shadow.focus = 1; // default


//Create a sphere to indicate the position of the light
const sphereGeometry = new THREE.SphereGeometry( 4);
const sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff00ff } );
const sphere = new THREE.Mesh( sphereGeometry, sphereMaterial );
sphere.castShadow = true; //default is false
sphere.receiveShadow = false; //default
sphere.rotateX(Math.PI);
sphere.position.y = 70;
scene.add( sphere );

//Create a plane that receives shadows (but does not cast them)
const planeGeometry = new THREE.PlaneGeometry( 300, 300 );
const planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } )
const plane = new THREE.Mesh( planeGeometry, planeMaterial );
plane.rotateY(Math.PI/2);
plane.rotateX(Math.PI/2*3);

// plane.position.x = -30;
plane.position.y = -30;
// plane.position.z = -30;

plane.receiveShadow = true;
scene.add( plane );

//Create a helper for the shadow camera (optional)
// const helper = new THREE.CameraHelper( light.shadow.camera );
// scene.add( helper );

const geometry = new THREE.RingGeometry( 5, 20, 32 );
const material = new THREE.MeshBasicMaterial( { color: 0xffff00, side: THREE.DoubleSide } );
const mesh = new THREE.Mesh( geometry, material );
//

/* 

*/

mesh.castShadow = true; //default is false
mesh.receiveShadow = false; //default
mesh.rotateX(Math.PI / 2);

function rot()
{
    var posi_y = 21;
    var dis = 5;
    // var angle = 0;
    
    var phi_x = Math.PI / 2 / 20 * Number(document.getElementById("light_z").value);
    mesh.position.y = posi_y - Math.cos(phi_x) * dis;
    mesh.position.x = Math.sin(phi_x) * dis ;
    mesh.rotation.y = (phi_x);
}


mesh.position.y = 21;
// mesh.position.x = 21;

scene.add( mesh );


const geometry2 = new THREE.RingGeometry( 5, 20, 32 );
const material2 = new THREE.MeshBasicMaterial( { color: 0xffff00, side: THREE.DoubleSide } );
const mesh2 = new THREE.Mesh( geometry2, material2 );

mesh2.castShadow = true; //default is false
mesh2.receiveShadow = false; //default
mesh2.rotateX(Math.PI / 2);
mesh2.position.y = 30;
mesh2.center
scene.add( mesh2 );

const directionalLight = new THREE.DirectionalLight( 0xffffff, 0.5 );
directionalLight.position.set(1,0,1);
scene.add( directionalLight );
directionalLight.intensity = 10;

function light_move()
{
    electron_beam.position.x = Number(document.getElementById("light_x").value);
    // light.position.y = Number(document.getElementById("light_y").value);
    electron_beam.position.z = Number(document.getElementById("light_z").value);
    // sphere.position.y = Number(document.getElementById("light_z").value);
    
    sphere.position.x = electron_beam.position.x;
    sphere.position.y = electron_beam.position.y;
    sphere.position.z = electron_beam.position.z;
    // sphere.position.y = 70
    sphere.position.y +=5;
}

// spin of one anode

function draw() {
    renderer_global.render(scene,camera_global);
    renderer_direct.render(scene,camera_direct);
    requestAnimationFrame(draw);
    rot();
}

draw();

